<div id="sidebar_derecha">
<section id="menu" role="complementary">

		<!-- This wrapper is used by several responsive layouts -->
		<div id="menu-content">

			<header>
			{{usuario}}
			</header>

			<div id="profile">
				<img src="plantilla/img/user.png" width="64" height="64" alt="User name" class="user-icon">
				Bienvenido..
				<span class="name">{{nombre_completo}}</span>
			</div>

			<!-- By default, this section is made for 4 icons, see the doc to learn how to change this, in "basic markup explained" -->
			<ul id="access" class="children-tooltip">
				<li><a href="plantilla/inbox.html" title="Messages"><span class="icon-inbox"></span><span class="count">2</span></a></li>
				<li><a href="plantilla/calendars.html" title="Calendar"><span class="icon-calendar"></span></a></li>
				<li><a href="plantilla/login.html" title="Profile"><span class="icon-user"></span></a></li>
				<li class="disabled"><span class="icon-gear"></span></li>
			</ul>

			<section class="navigable">
				<ul class="big-menu">
					<li class="with-right-arrow">
						<span><span class="list-count">11</span>Main styles</span>
						<ul class="big-menu">
							<li><a href="plantilla/typography.html">Typography...</a></li>
							<li><a href="plantilla/columns.html">Columnss</a></li>
							<li><a href="plantilla/tables.html">Tables</a></li>
							<li><a href="plantilla/colors.html">Colors &amp; backgrounds</a></li>
							<li><a href="plantilla/icons.html">Icons</a></li>
							<li><a href="plantilla/files.html">Files &amp; Gallery</a></li>
							<li class="with-right-arrow">
								<span><span class="list-count">4</span>Forms &amp; buttons</span>
								<ul class="big-menu">
									<li><a href="plantilla/buttons.html">Buttons</a></li>
									<li><a href="plantilla/form.html">Forsm elements</a></li>
									<li><a href="plantilla/textareas.html">Textareas &amp; WYSIWYG</a></li>
									<li><a href="plantilla/form-layouts.html">Form layouts</a></li>
									<li><a href="plantilla/wizard.html">Wizard</a></li>
								</ul>
							</li>
							<li class="with-right-arrow">
								<span><span class="list-count">2</span>Agenda &amp; Calendars</span>
								<ul class="big-menu">
									<li><a href="plantilla/agenda.html">Agenda</a></li>
									<li><a href="plantilla/calendars.html">Calendars</a></li>
								</ul>
							</li>
							<li><a href="plantilla/blocks.html">Block..s &amp; infos</a></li>
						</ul>
					</li>
					<li class="with-right-arrow">
						<span><span class="list-count">8</span>Main features</span>
						<ul class="big-menu">
							<li><a href="plantilla/auto-setup.html">Automatic setup</a></li>
							<li><a href="plantilla/responsive.html">Responsiveness</a></li>
							<li><a href="plantilla/tabs.html">Tabs</a></li>
							<li><a href="plantilla/sliders.html">Slider &amp; progress</a></li>
							<li><a href="plantilla/modals.html">Modal windows</a></li>
							<li class="with-right-arrow">
								<span><span class="list-count">3</span>Messages &amp; notifications</span>
								<ul class="big-menu">
									<li><a href="plantilla/messages.html">Messages</a></li>
									<li><a href="plantilla/notifications.html">Notifications</a></li>
									<li><a href="plantilla/tooltips.html">Tooltips</a></li>
								</ul>
							</li>
						</ul>
					</li>
					<li class="with-right-arrow">
						<a href="plantilla/ajax-demo/submenu.html" class="navigable-ajax" title="Menu title">With ajax sub-menu</a>
					</li>
				</ul>
			</section>
            
                <!-- ********** Contenido General !!!!!!!!!!!!!!!! -->
    <ul class="unstyled-list">
      <li class="title-menu">Today's event</li>
      <li>
        <ul class="calendar-menu">
          <li> <a href="#" title="See event">
            <time datetime="2011-02-24"><b>24</b> Feb</time>
            <small class="green">10:30</small> Event's description </a> </li>
        </ul>
      </li>
      <li class="title-menu">New messages</li>
      <li>
        <ul class="message-menu">
          <li> <span class="message-status"> <a href="#" class="starred" title="Starred">Starred</a> <a href="#" class="new-message" title="Mark as read">New</a> </span> <span class="message-info"> <span class="blue">17:12</span> <a href="#" class="attach" title="Download attachment">Attachment</a> </span> <a href="#" title="Read message"> <strong class="blue">John Doe</strong><br>
            <strong>Mail subject</strong> </a> </li>
          <li> <a href="#" title="Read message"> <span class="message-status"> <span class="unstarred">Not starred</span> <span class="new-message">New</span> </span> <span class="message-info"> <span class="blue">15:47</span> </span> <strong class="blue">May Starck</strong><br>
            <strong>Mail subject a bit longer</strong> </a> </li>
          <li> <span class="message-status"> <span class="unstarred">Not starred</span> </span> <span class="message-info"> <span class="blue">15:12</span> </span> <strong class="blue">May Starck</strong><br>
            Read message </li>
        </ul>
      </li>
    </ul>
  </div>
  <!-- End content wrapper --> 
<footer id="menu-footer">
  <p class="button-height">
    <input type="checkbox" name="auto-refresh" id="auto-refresh" checked="checked" class="switch float-right">
    <label for="auto-refresh">Auto-refresh</label>
  </p>
</footer>
</section>
</div>